<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
        "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
	<title>Dijit Tree Programmatic Test</title>

	<style someProperty="text/css">
		@import "../../../dojo/resources/dojo.css";
		@import "../css/dijitTests.css";
		@import "../../../dojo/resources/dnd.css";
		@import "../../../dojo/tests/dnd/dndDefault.css";
	</style>

	<!-- required: the default dijit theme: -->
	<link id="themeStyles" rel="stylesheet" href="../../../dijit/themes/claro/claro.css">

	<!-- required: dojo.js -->
	<script type="text/javascript" src="../../../dojo/dojo.js"
		djConfig="isDebug: true, parseOnLoad: true"></script>

	<!-- only needed for alternate theme testing: -->
	<script type="text/javascript" src="../_testCommon.js"></script>

	<script language="JavaScript" someProperty="text/javascript">
		dojo.require("dijit.dijit"); // optimize: load dijit layer
		dojo.require("dojo.data.ItemFileWriteStore");
		dojo.require("dijit.Tree");
		dojo.require("dijit.tree.ForestStoreModel");
		dojo.require("dijit.tree.dndSource");

		dojo.addOnLoad(function(){
 			myStore = new dojo.data.ItemFileWriteStore({url:'../_data/countries.json'});
			myModel = new dijit.tree.ForestStoreModel({
				store: myStore,
				query: {type:'continent'},
				rootId: "earth",
				rootLabel: "Earth",
				childrenAttrs: ["children"]
			});
		});

		function createTree(){
			myTree = new dijit.Tree({
				id: "myTree",
				model: myModel,
				dndController: "dijit.tree.dndSource"
			});
			dojo.byId("container").appendChild(myTree.domNode);
			myTree.startup();
			dojo.byId("create").disabled = true;
			dojo.byId("destroy").disabled = false;
		}

		function destroyTree(){
			myTree.destroy();
			dojo.byId("create").disabled = false;
			dojo.byId("destroy").disabled = true;
		}
	</script>
</head>
<body class="claro">
        <h1 class="testTitle">Dijit Forest Store Programmatic Test</h1>
        <button id="create" onclick="createTree();">Create Tree</button>
        <button id="destroy" onclick="destroyTree();" disabled>Destroy Tree</button>
        <div id="container"></div>
</body>
</html>
